/**
 * 发票来源
 */
import React, { Component } from "react";
import { connect } from "react-redux";
import { Popover, Badge, Radio, Popconfirm, message } from "antd";
import { deepCopy, isObjectValueEqual, messages } from "share/common";
import errorMessage from "share/errorMessage";
import InvoiceSourceDetail from "./invoice-source-detail";
import TableList from "../table-list";
import settingService from "../request-and-expense-settings.service";
import { batchOperations } from "components/template/wrapped-table-params/batch-operations";

const RadioGroup = Radio.Group;

class InvoiceSource extends Component {
  state = {
    loading: false,
    btnLoading: {},
    isAll: false,
    selectedRowKeys: [],
    selectedIntervalRowKeys: [],
    searchParams: {},
  };

  infoData = {
    // dataSource: { explain: messages('expense-2.key35')/*您可在此页面设置是否允许员工使用微信导入、支付宝导入、邮箱导入、手录形式归集发票。*/ },
    dataSource: {
      explain: messages(
        "expense-2.key36"
      ) /*您可在此页面设置是否允许员工使用微信导入、支付宝导入、邮箱导入、\"我的发票夹\"小程序导入、手录形式归集发票。*/,
    },
    attributes: [
      {
        title: messages("expense-2.key5") /*说明*/,
        dataIndex: "explain",
        span: 24,
      },
    ],
  };

  slideFrameInfo = {
    title: messages("expense-2.key1") /*发票来源*/,
    content: InvoiceSourceDetail,
  };

  defaultInfo = {
    title: messages("expense-2.key1") /*发票来源*/,
    data: [
      {
        title: messages("expense-2.key34") /*发票来源设置*/,
        titleStyle: { marginTop: 0 },
        label: messages("expense-2.key20") /*微信导入电子票*/,
        value: messages("expense-2.key18") /*开启*/,
        extra: messages(
          "expense-2.key21"
        ) /*配置为“开启”，可在账本和报销单中导入微信卡包中的电子发票*/,
      },
      {
        label: messages("expense-2.key22") /*支付宝导入发票*/,
        value: messages("expense-2.key18") /*开启*/,
        extra: messages(
          "expense-2.key23"
        ) /*配置为“开启”，可在账本和报销单中导入支付宝发票管家中的发票*/,
      },
      {
        label: messages("expense-2.key24") /*是否导入匹配的支付宝账单记录*/,
        value: messages("common.yes") /*是*/,
        extra: messages(
          "expense-2.key25"
        ) /*导入支付宝发票时，系统在支付宝账单中匹配此发票对应的消费记录，若匹配成功，则会将消费记录带入发票关联的费用中；若未匹配成功，则不带入*/,
      },
      {
        // label: messages('expense-2.key26')/*邮箱导入发票*/,
        value: messages("expense-2.key18") /*开启*/,
        // extra: messages('expense-2.key27')/*配置为“开启”，可在账本和报销单中导入汇联易邮箱中的发票*/,
        // 发票夹设置配置页面文件修改 9125
        label: messages("expense-2.key28") /*发票夹与邮箱导入发票*/,
        extra: messages(
          "expense-2.key29"
        ) /*配置为“开启”，可在账本和报销单中导入微信小程序“我的发票夹”中，或导入汇联易邮箱中的发票*/,
      },
      {
        value: messages("expense-2.key18") /*开启*/,
        label: messages("expense-2.key30") /*扫发票二维码*/,
        extra: messages(
          "expense-2.key31"
        ) /*配置为“开启”，可在账本和报销单中扫发票二维码归集发票*/,
      },
      {
        label: messages("expense-2.key32") /*手录发票*/,
        value: messages("expense-2.key18") /*开启*/,
        extra: messages(
          "expense-2.key33"
        ) /*配置为“开启”，可在账本和报销单中手录发票生成费用，也可在费用详情页手录发票*/,
      },
    ],
  };

  searchForm = [
    {
      id: "levelCode",
      dataIndex: "levelCode",
      label: messages("expense-2.key37") /*层级*/,
      component: (
        <RadioGroup>
          <Radio value="COMPANY">{messages("expense-2.key38") /*公司*/}</Radio>
          <Radio value="TENANT">{messages("expense-2.key39") /*租户*/}</Radio>
        </RadioGroup>
      ),
      tagParser: (value) => {
        return value === "COMPANY"
          ? messages("expense-2.key38") /*公司*/
          : messages("expense-2.key39") /*租户*/;
      },
    },
    {
      id: "companyOIDs",
      dataIndex: "companyNameList",
      label: messages("expense-2.key40") /*启用公司*/,
      component: "Chooser",
      props: {
        labelKey: "name",
        valueKey: "id",
        type: "priority_company",
      },
      parser: (value) => ({
        companyIds: value ? value.map((item) => item.id) : null,
      }),
    },
  ];

  columns = [
    {
      title: messages("expense-2.key37") /*层级*/,
      dataIndex: "levelCode",
      width: "10%",
      render: (value) =>
        value === "COMPANY"
          ? messages("expense-2.key38") /*公司*/
          : messages("expense-2.key39") /*租户*/,
    },
    {
      title: messages("expense-2.key41") /*所属组织*/,
      dataIndex: "levelOrgName",
      render: (value) => (
        <Popover content={value} placement="topLeft">
          {value}
        </Popover>
      ),
    },
    {
      title: messages("expense-2.key40") /*启用公司*/,
      dataIndex: "companyNameList",
      render: (value) => {
        if (value && value.length) {
          let content = value.join("，");
          return (
            <Popover content={content} placement="topLeft">
              {content}
            </Popover>
          );
        }
        return messages("expense-2.key42"); /*通用*/
      },
    },
    {
      title: messages("common.column.status") /*状态*/,
      dataIndex: "enabled",
      width: "10%",
      render: (value) => (
        <Badge
          status={value ? "success" : "error"}
          text={
            value
              ? messages("common.status.enable") /*启用*/
              : messages("common.status.disable") /*禁用*/
          }
        />
      ),
    },
    {
      title: messages("common.operation") /*操作*/,
      dataIndex: "receiptSourceOptId",
      width: "10%",
      render: (value, record) =>
        record.readOnly ? (
          <span onClick={(e) => e.stopPropagation()} className="font-disabled">
            {messages("common.delete") /*删除*/}
          </span>
        ) : (
          <Popconfirm
            title={messages("common.confirm.delete") /*确定要删除吗？*/}
            onConfirm={() => this.handleDelete(value)}
          >
            <a onClick={(e) => e.stopPropagation()}>
              {messages("common.delete") /*删除*/}
            </a>
          </Popconfirm>
        ),
    },
  ];

  handleDelete = (id) => {
    this.setState({ loading: true });
    return settingService
      .deleteInvoiceSource(id)
      .then(() => {
        this.setState({ loading: false });
        this.advancedTableRef.getList();
        message.success(
          messages("common.delete.success", { arg1: "" }) /*{arg1} 删除成功*/
        );
      })
      .catch((e) => {
        this.setState({ loading: false });
        errorMessage(e.response);
      });
  };

  service = (page, size, searchParams) => {
    return settingService.getInvoiceSourceList(page, size, searchParams);
  };

  render() {
    const { loading } = this.state;
    let tableParams = batchOperations(
      {
        rowKey: "receiptSourceOptId",
      },
      [
        {
          type: "DELETE",
          modalTitle: messages("expense-2.key43") /*删除发票来源设置*/,
          modalContent: messages("expense-2.key44") /*确认删除发票来源设置*/,
          service: settingService.batchDeleteInvoiceSource,
          onOk: () => this.advancedTableRef.getList(),
        },
        {
          type: "ENABLE",
          service: settingService.batchOpenOrCloseInvoiceSource,
          onOk: () => this.advancedTableRef.getList(),
        },
        {
          type: "DISABLE",
          service: settingService.batchOpenOrCloseInvoiceSource,
          onOk: () => this.advancedTableRef.getList(),
        },
      ],
      this
    );
    return (
      <div style={{ height: "calc(100% - 64px)" }}>
        <TableList
          infoData={this.infoData}
          slideFrameInfo={this.slideFrameInfo}
          defaultInfo={this.defaultInfo}
          afterClose={(refresh) =>
            typeof refresh === "boolean" &&
            refresh &&
            this.advancedTableRef.getList()
          }
          tableParams={{
            tableName: "invoice-source-setting-table",
            loading,
            rowKey: "receiptSourceOptId",
            searchForm: this.searchForm,
            columns: this.columns,
            service: this.service,
            onRef: (ref) => (this.advancedTableRef = ref),
            ...tableParams,
          }}
        />
      </div>
    );
  }
}

function mapStateToProps(state) {
  return {};
}

export default connect(mapStateToProps)(InvoiceSource);
